function xheModel() {

    //模块属性
    this.options = {
        control: '',                                           //组件容器的ID
        index: 0,                                              //组件容器的索引
        titleShow: true,                                       //是否显示模块标题文本
        titleText: '',                                         //模块标题文本，支持使用\n换行
        titleColor: ["0073FF", "00E9FF", "01ABFF"],              //模块标题文字的颜色
        titleStyle: 'normal',                                  //模块标题文字字体的风格,normal/italic
        titleWeight: 'bold',                                   //模块标题文字字体的粗细,normal/bold/bolder/lighter
        titleSize: '2.1',                                      //模块标题文字的字体大小
        titleBackgroudColor: ["020778", "767BFF", "050B81"],     //模块标题栏的背景颜色
        titlePosition: 'left',                                 //模块标题文字的对齐方式,left\center\right       
        borderShow: true,                                      //是否显示模块边框
        borderColor: '19BA8B',                                 //模块边框颜色
        borderWidth: 1,                                        //模块边框粗细
        borderRadius: true,                                      //模块边框的边角
        borderTransparent: 0.17,
        backgroudColor: 'FFFFFF',                              //模块底色
        backgroudTransparent: 0.04,                            //模块背景透明度,取值范围在0~1之间
        backgroudImage: '../../common/imgs/line.png',          //模块背景,该属性与backgroudColor互斥
        backgroundSize: true
    };
    //根据属性设置模块
    this.load = function () {

        try {
            if (this.options.titleShow) {
                document.getElementById("h_head_" + this.options.index).style.display = "block";

                document.getElementById("spn_title_" + this.options.index).innerHTML = this.options.titleText;

                document.getElementById("h_head_" + this.options.index).style.backgroundImage = "linear-gradient(to right, " + String("#" + String(this.options.titleBackgroudColor[0]).replace("#", "")).colorRgb(0.8) + ", " + String("#" + String(this.options.titleBackgroudColor[1]).replace("#", "")).colorRgb(0.2) + ", " + String("#" + String(this.options.titleBackgroudColor[2]).replace("#", "")).colorRgb(0.1) + ")";

                document.getElementById("div_model_" + this.options.index).style.height = "calc(100% - 4vh)";
            }
            else {
                document.getElementById("h_head_" + this.options.index).style.display = "none";

                document.getElementById("spn_title_" + this.options.index).innerHTML = "&nbsp;";

                document.getElementById("h_head_" + this.options.index).style.backgroundImage = "";

                document.getElementById("div_model_" + this.options.index).style.height = "99%";
            }

            document.getElementById("spn_title_" + this.options.index).style.backgroundImage = "-webkit-linear-gradient(right, #" + String(this.options.titleColor[0]).replace("#", "") + ", #" + String(this.options.titleColor[1]).replace("#", "") + ", #" + String(this.options.titleColor[2]).replace("#", "") + ")";

            document.getElementById("spn_title_" + this.options.index).style.fontStyle = this.options.titleStyle;

            document.getElementById("spn_title_" + this.options.index).style.fontWeight = this.options.titleWeight;

            document.getElementById("spn_title_" + this.options.index).style.fontSize = this.options.titleSize + "vh";

            document.getElementById("div_head_" + this.options.index).style.textAlign = this.options.titlePosition;

            document.getElementById("div_content_" + this.options.index).style.border = this.options.borderWidth + "px solid " + String("#" + String(this.options.borderColor).replace("#", "")).colorRgb(0.17);

            if (this.options.backgroudImage != '') {
                document.getElementById("div_content_" + this.options.index).style.background = String("#" + String(this.options.backgroudColor).replace("#", "")).colorRgb(this.options.backgroudTransparent) + " url(" + this.options.backgroudImage + ")";

                if (this.options.backgroundSize == false) {
                    //document.getElementById("div_content_" + this.options.index).style.backgroundSize = "";
                }
                else {
                    document.getElementById("div_content_" + this.options.index).style.backgroundSize = "100% 100%";
                }
            }
            else {
                document.getElementById("div_content_" + this.options.index).style.background = String("#" + String(this.options.backgroudColor).replace("#", "")).colorRgb(this.options.backgroudTransparent);
            }

            if (this.options.borderShow) {
                document.getElementById("div_content_" + this.options.index).style.border = "solid " + this.options.borderWidth + "px " + ("#" + this.options.borderColor).colorRgb(0.2);

                if (this.options.borderRadius) {

                    document.getElementById("div_content_" + this.options.index).className = "grid-stack-item-content boxall";
                    document.getElementById("div_foot_" + this.options.index).className = "boxfoot";
                }
                else {
                    document.getElementById("div_content_" + this.options.index).className = "grid-stack-item-content";
                    document.getElementById("div_foot_" + this.options.index).className = "";
                }
            }
            else {
                document.getElementById("div_content_" + this.options.index).style.border = "none";
                document.getElementById("div_content_" + this.options.index).className = "grid-stack-item-content";
                document.getElementById("div_foot_" + this.options.index).className = "";
            }
        }
        catch (e) {
            alert(e)
        }
    };
    //将属性绑定至编辑区域的控件上
    this.bind = function () {
        try {
            if (this.options.backgroundSize == undefined) {
                this.options.backgroundSize = true;
            }
            if (this.options.borderTransparent == undefined) {
                this.options.borderTransparent = 0.17;
            }
            document.getElementById("model_titleShow").checked = this.options.titleShow;
            document.getElementById("model_titleText").value = this.options.titleText;
            document.getElementById("model_titleColor_0").value = this.options.titleColor[0];
            document.getElementById("model_titleColor_1").value = this.options.titleColor[1];
            document.getElementById("model_titleColor_2").value = this.options.titleColor[2];
            document.getElementById("model_titleStyle").value = this.options.titleStyle;
            document.getElementById("model_titleWeight").value = this.options.titleWeight;
            document.getElementById("model_titleSize").value = this.options.titleSize;
            document.getElementById("model_titleBackgroudColor_0").value = this.options.titleBackgroudColor[0];
            document.getElementById("model_titleBackgroudColor_1").value = this.options.titleBackgroudColor[1];
            document.getElementById("model_titleBackgroudColor_2").value = this.options.titleBackgroudColor[2];
            document.getElementById("model_titlePosition").value = this.options.titlePosition;
            document.getElementById("model_borderShow").checked = this.options.borderShow;
            document.getElementById("model_borderColor").value = this.options.borderColor;
            document.getElementById("model_borderWidth").value = this.options.borderWidth;
            document.getElementById("model_borderRadius").checked = this.options.borderRadius;
            document.getElementById("model_borderTransparent").value = this.options.borderTransparent;
            document.getElementById("model_backgroudColor").value = this.options.backgroudColor;
            document.getElementById("model_backgroudTransparent").value = this.options.backgroudTransparent;
            document.getElementById("model_backgroudImage").value = this.options.backgroudImage;
            document.getElementById("model_backgroundSize").checked = this.options.backgroundSize;

            document.getElementById("model_titleColor_0").style.backgroundColor = "#" + this.options.titleColor[0];
            document.getElementById("model_titleColor_1").style.backgroundColor = "#" + this.options.titleColor[1];
            document.getElementById("model_titleColor_2").style.backgroundColor = "#" + this.options.titleColor[2];
            document.getElementById("model_titleBackgroudColor_0").style.backgroundColor = "#" + this.options.titleBackgroudColor[0];
            document.getElementById("model_titleBackgroudColor_1").style.backgroundColor = "#" + this.options.titleBackgroudColor[1];
            document.getElementById("model_titleBackgroudColor_2").style.backgroundColor = "#" + this.options.titleBackgroudColor[2];
            document.getElementById("model_borderColor").style.backgroundColor = "#" + this.options.borderColor;
            document.getElementById("model_backgroudColor").style.backgroundColor = "#" + this.options.backgroudColor;
        }
        catch (e) {

            alert(e)
        }
    };
    //将编辑区域控件的值赋值给属性
    this.set = function () {
        try {

            this.options.titleShow = document.getElementById("model_titleShow").checked;
            this.options.titleText = document.getElementById("model_titleText").value;
            this.options.titleColor[0] = document.getElementById("model_titleColor_0").value;
            this.options.titleColor[1] = document.getElementById("model_titleColor_1").value;
            this.options.titleColor[2] = document.getElementById("model_titleColor_2").value;
            this.options.titleStyle = document.getElementById("model_titleStyle").value;
            this.options.titleWeight = document.getElementById("model_titleWeight").value;
            this.options.titleSize = document.getElementById("model_titleSize").value;
            this.options.titleBackgroudColor[0] = document.getElementById("model_titleBackgroudColor_0").value;
            this.options.titleBackgroudColor[1] = document.getElementById("model_titleBackgroudColor_1").value;
            this.options.titleBackgroudColor[2] = document.getElementById("model_titleBackgroudColor_2").value;
            this.options.titlePosition = document.getElementById("model_titlePosition").value;
            this.options.borderShow = document.getElementById("model_borderShow").checked;
            this.options.borderColor = document.getElementById("model_borderColor").value;
            this.options.borderWidth = document.getElementById("model_borderWidth").value;
            this.options.borderRadius = document.getElementById("model_borderRadius").checked;
            this.options.borderTransparent = document.getElementById("model_borderTransparent").value;
            this.options.backgroudColor = document.getElementById("model_backgroudColor").value;
            this.options.backgroudTransparent = document.getElementById("model_backgroudTransparent").value;
            this.options.backgroudImage = document.getElementById("model_backgroudImage").value;
            this.options.backgroundSize = document.getElementById("model_backgroundSize").checked;
        }
        catch (e) {

            alert(e)
        }
    };
}